<!DOCTYPE html>
<html>
<head>


<!--

touches：表示当前跟踪的触摸操作的touch对象的数组。
targetTouches：特定于事件目标的Touch对象的数组。
changeTouches：表示自上次触摸以来发生了什么改变的Touch对象的数组。


参数：
clientX：触摸目标在视口中的x坐标。
clientY：触摸目标在视口中的y坐标。
identifier：标识触摸的唯一ID。
pageX：触摸目标在页面中的x坐标。
pageY：触摸目标在页面中的y坐标。
screenX：触摸目标在屏幕中的x坐标。
screenY：触摸目标在屏幕中的y坐标。
target：触目的DOM节点目标

-->



    <script type="module">

        import {TapEvent} from "../app/ElemEventHandler.js";

        function addTapEvent(){
            let divtap = document.getElementById("divtap");
            new TapEvent(divtap, function(){
                console.log("on tap event");
            });
        }

        addTapEvent();


        let divtouch = document.getElementById('divclick');
        divtouch.addEventListener('touchstart', function(){

        });

        let ptouch = document.getElementById('ptouch');
        ptouch.addEventListener('touchstart', function(e){
            let touches = e.touches;
            let targetTouches = e.targetTouches;
            let changedTouches = e.changedTouches;
            console.log('touchstart' + e.toString());
            e.preventDefault();
       });
        ptouch.addEventListener('touchend', function(e){
            let touches = e.touches;
            let targetTouches = e.targetTouches;
            let changedTouches = e.changedTouches;
            console.log('touchend:' + e.toString());
        });

    </script>
</head>
<body>

<div id="divtap">tap event</div>


<div id="divclick">click event</div>


<div id="divtouch">
    <p id="ptouch">touch event test</p>
</div>

</body>
</html>